<template>
	<!-- c端用户 -->
	<view class="container">
		<!-- <image src="../../static/bgc.jpg" mode=""></image> -->
		<!-- <view class="tags">
			<text :class="current == 0? 'selected' : ''" @click="handleTagsClick(0)">关注</text>
			<text :class="current == 1? 'selected' : ''" @click="handleTagsClick(1)">推荐</text>
		</view> -->
		<view class="top">
			<image src="../../static/search.png" mode="" v-if="showif"></image>
			<input type="text" v-model="val" placeholder="搜 索" @input="handleInput" confirm-type="search" placeholder-style="color:#B0B0B0;font-size:26rpx; text-align:center;" />
		</view>
		<template >
			<shopModel :data="storeList"/>
		</template>
	</view>
</template>

<script>
	import shopModel from '../../components/shopModel.vue'
	import {request} from '@/utils/api.js'
	export default {
		components:{shopModel},
		data() {
			return {
				val:'',
				showif:true,
				current:0,
				storeList:[]
			}
		},
		onShow(){
			//清空搜索
			this.val = ''
			request({
				url:'/store/list',
				methods:'POST',
				
			}).then(res=>{
				this.storeList = res.data;
			})
		},
		onPullDownRefresh(){
			
		},
		onLoad(){
			
		},
		methods: {
			handleTagsClick(e){
				this.current = e
			},
			handleInput(e){
				console.log(e.detail.value)
				if(e.detail.value) {
					this.showif = false
				}else this.showif = true
			}
		}
	}
</script>

<style scoped lang="scss">
	page{
		background-color: #F5F5F5;
	}
	.container {
		.tags{
			margin: 10rpx auto;
			text-align: center;
			text{
				display: inline-block;
				padding-bottom: 3rpx;
				margin-right: 40rpx;
				color: #bbb;
			}
			margin-bottom: 20rpx;
			.selected{
				color: #666;
				font-weight: bold;
				border-bottom: 4rpx solid #ff7c0a;
				
			}
		}
		.top{
			position: relative;
			image{
				width: 46rpx;
				height: 46rpx;
				position: absolute;
				left: 306rpx;
				top: 8rpx;
				
			}
			input{
				background-color: #ebebeb;
				height: 62rpx;
				width: 680rpx;
				margin: 20rpx auto;
				border-radius: 10rpx;
				padding-left: 20rpx;
			}
		}
		
		
	}
</style>
